Streamlit

Streamlit - 😃

• Lots of elements to use
  • New ones all the time
• Very Pythonic
  • Simple to transition from script

Streamlit - 🫤

• Runs top to bottom - not at all reactive
• Can get very slow if it gets big
  • Has caching, session_state
• All Streamlit apps kinda look the same
  • Hard to tweak UI

Streamlit

Streamlit-Lite

• Stlite
  • Not officially supported by Streamlit
• Pretty easy interface to copy your Streamlit apps
• I couldn’t figure out how to do streaming
• Slower to load, slower to run

Gradio

Gradio - 😃

• Very focused on AI
• Even simpler than Streamlit
• Built in interfaces for Chat
  • Easy to add in features like chat history, Thumbs Up/ Thumbs Down
• Has reactivity

Gradio - 🫤

• Less flexible than Streamlit
  • Complicated to do multiple things at once
• Fewer components available
  • Sometimes need to use HTML to do what you want
• All Gradio apps look the same – at least as much as Streamlit

Gradio - Simplest

Gradio - More Complex

Gradio - Deployment Possibilities

• Local / Self-hosted
• Public Link, local compute (share=True)
• Through Huggingface Spaces (free with basic CPU)
• In-browser (Gradio Lite)
  • I couldn’t figure it out for complex app

Shiny

• 2012: Developed for R by the company formerly known as RStudio
• 2022:
  

Shiny - 😃

• All Shiny is reactive - great for complex Apps
• Very flexible, can make almost any change you want
• Lots of components
• Documentation gives really good background/philosophy on how it works

Shiny - 🫤

• I found it confusing, not as intuitive/“Pythonic”
• Default UI is pretty bland
• Not as many components as Streamlit
• You kinda need to learn the philosophy of Shiny before you can do much complicated

Shiny Example

Shiny is building in Chat Components

Help is on the way!

Shinylive

Shinylive really is easy!

One other option…

If you’re going to go in-browser, and what you’re doing isn’t that complex…

Ask ChatGPT to build you an in-browser tool

It will then improve it nicely

So What Should I Do?

If you know one tool well, you can use it for most things - they overlap a lot.

Really, What Should I Do?

%%{init: {'theme': 'default', 'themeVariables': { 'fontSize': '20px', 'fontFamily': 'arial', 'nodeTextColor': '#000000', 'mainBkg': '#f5f5f5' }}}%%
flowchart LR
    A[Start] --> B{Running a simple<br>AI model?}
    B -->|Yes| C[Use Gradio]
    B -->|No| F{Need complex app with<br>lots of interactive changes?}
    F -->|Yes| E[Use Shiny]
    F -->|No| H[Use Streamlit]

    style C fill:#90EE90,color:#000000,font-weight:bold
    style E fill:#90EE90,color:#000000,font-weight:bold
    style H fill:#90EE90,color:#000000,font-weight:bold
    style B fill:#f5f5f5,color:#000000,font-weight:bold
    style F fill:#f5f5f5,color:#000000,font-weight:bold
    style A fill:#f5f5f5,color:#000000,font-weight:bold

But …

%%{init: {'theme': 'default', 'themeVariables': { 'fontSize': '16px', 'fontFamily': 'arial', 'nodeTextColor': '#000000', 'mainBkg': '#f5f5f5', 'labelBackgroundColor': 'transparent' }}}%%
flowchart LR

    A([Start])
    X{Is this a one-off app that<br>can be done in-browser and<br>doesn't need heavy Python?}
    Y[Just ask an LLM<br>to make it for you]
    
    A --> X
    X -->|Yes| Y
    X -->|No| B
    subgraph Python-Frameworks[" "]
        direction LR
        B{Running a simple<br>AI model?}
        B -->|Yes| C[Use Gradio]
        B -->|No| F{Need complex app with<br>lots of interactive changes?}
        F -->|Yes| E[Use Shiny]
        F -->|No| H[Use Streamlit]
    end

    style C fill:#90EE90,color:#000000,font-weight:bold
    style H fill:#90EE90,color:#000000,font-weight:bold
    style E fill:#90EE90,color:#000000,font-weight:bold
    style Y fill:#90EE90,color:#000000,font-weight:bold,font-size:16px,stroke:#000000,stroke-width:3px
    style B fill:#f5f5f5,color:#000000,font-weight:bold
    style F fill:#f5f5f5,color:#000000,font-weight:bold
    style A fill:#f5f5f5,color:#000000,font-weight:bold,fontSize:20px
    style X fill:#f5f5f5,color:#000000,font-weight:bold
    
    style Python-Frameworks fill:#e0e0e0,stroke-dasharray: 5 5